import { defineStore } from "pinia";
interface dragType{
  id: string,
  key: string,
  type: string,
  props: any,
  otherProps: any,
  highEdit: any,
  methods: any
}
interface renderType{
  id: string,
  type: string,
  leftOpt:{
    label: string,
    preview: any,
  },
  middleOpt:{
    render: any,
    props: any,
    highEdit: any,
    otherProps: any,
  },
  rightOpt:{
    settingRender:{
      type: string,
      label: string,
      propKey: string[],
      editType: string,
      tip: string,
    }[]
  },
  headerOpt:{
    template: any,
    script: any,
    onMountedScript: any,
  },
}
interface dragStoreType{
  dragCurrent: dragType,
  renderData:renderType[],
  registerConfig: { componentList: dragType[], componentMap: {string:dragType} },
  dragStyle: string,
  clickItem: dragType,
  clickItemCopy: dragType,
  clickParent: dragType,
  enterItem: dragType,
  leaveItem: dragType,
  refList: {},
  currentForm: any,
  enter: false,
  clickItemSettings: any
}
export const useDrag = defineStore("drag", {
  state: ():dragStoreType => ({
    dragCurrent: {},
    renderData: [],
    registerConfig: { componentList: [], componentMap: {} },
    dragStyle: "",
    clickItem: { settingRender: [], props: { item: { style: "", label: "" } } },
    clickItemCopy: {},
    clickParent: null,
    enterItem: null,
    leaveItem: null,
    refList: {},
    currentForm: null,
    enter: false,
    clickItemSettings: {}
  }),
  actions: {
    allReset() {
      this.dragReset();
      this.clickReset();
      this.renderData = [];
      nextTick(() => {
        this.refList = {};
      });
    },
    dragReset() {
      this.dragStyle = "";
      this.dragCurrent = {};
      if (this.leaveItem) {
        this.leaveItem.leaveElement = false;
        this.leaveItem = null;
      }
      if (this.enterItem) {
        this.enterItem.click = false;
        this.enterItem = null;
      }
      this.enter = false;
    },
    clickReset() {
      this.currentForm = null;
      this.clickItemCopy = {};
      this.clickItem.click = false;
      this.clickItemSettings = {};
      this.clickItem = { settingRender: [], props: { item: { style: "", label: "" } } };
      this.clickParent = null;
    }
  },
  persist: []
});
